import 'package:flutter/material.dart';
import '../models.dart';
import 'package:todos_app_core/todos_app_core.dart';

class FilterButton extends StatelessWidget {
  final PopupMenuItemSelected<VisibilityFilter> onSelected;
  final VisibilityFilter activeFilter;
  final bool isActive;
  const FilterButton(
      {required this.onSelected,
      required this.activeFilter,
      required this.isActive,
      Key? key})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    final defaultStyle = Theme.of(context).textTheme.bodyMedium!;
    final activeStyle = Theme.of(context)
        .textTheme
        .bodyMedium!
        .copyWith(color: Theme.of(context).colorScheme.secondary);
    final button = _Button(
      onSelected: onSelected,
      activeFilter: activeFilter,
      activeStyle: activeStyle,
      defaultStyle: defaultStyle,
    );
    return AnimatedOpacity(
      opacity: isActive ? 1.0 : 0.0,
      duration: Duration(milliseconds: 200),
      child: isActive ? button : IgnorePointer(child: button),
    );
  }
}

class _Button extends StatelessWidget {
  final PopupMenuItemSelected<VisibilityFilter> onSelected;
  final VisibilityFilter activeFilter;
  final TextStyle activeStyle;
  final TextStyle defaultStyle;
  const _Button(
      {required this.onSelected,
      required this.activeFilter,
      required this.activeStyle,
      required this.defaultStyle,
      Key? key})
      : super(key: key);

  @override
  Widget build(BuildContext context) {
    return PopupMenuButton<VisibilityFilter>(
        key: ArchSampleKeys.filterButton,
        icon: Icon(Icons.filter_list),
        onSelected: onSelected,
        itemBuilder: (BuildContext context) => [
              PopupMenuItem(
                value: VisibilityFilter.all,
                key: ArchSampleKeys.allFilter,
                child: Text(
                  ArchSampleLocalizations.of(context)!.showAll,
                  style: activeFilter == VisibilityFilter.all
                      ? activeStyle
                      : defaultStyle,
                ),
              ),
              PopupMenuItem(
                value: VisibilityFilter.active,
                key: ArchSampleKeys.activeFilter,
                child: Text(
                  ArchSampleLocalizations.of(context)!.showActive,
                  style: activeFilter == VisibilityFilter.active
                      ? activeStyle
                      : defaultStyle,
                ),
              ),
              PopupMenuItem(
                value: VisibilityFilter.completed,
                key: ArchSampleKeys.completedFilter,
                child: Text(
                  ArchSampleLocalizations.of(context)!.showCompleted,
                  style: activeFilter == VisibilityFilter.completed
                      ? activeStyle
                      : defaultStyle,
                ),
              ),
            ]);
  }
}
